<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>个人博客-茶会</title>
  <link rel="stylesheet" href="css/tea.css">
  <link rel="stylesheet" href="css/font-awesome.min.css">
</head>
<body>
<!--头部-->
<header class="header-wrapper">
  <div class="header-content">
    <div class="middle">
      <div class="info">
        <a href=""><div class="item"><span class="icon icon-tv"></span>主页</div></a>
        <div class="item">画友</div>
        <div class="item">游戏中心</div>
        <div class="item">直播</div>
        <div class="item">周边</div>
        <div class="item">萌战</div>
      </div>


      <div class="user">
        <a style=" color: #222;" href="#"><div class="item">用户</div></a>
        <div class="item">消息</div>
        <div class="item">动态</div>
        <div class="item">收藏夹</div>
        <div class="item">历史</div>
        <div class="item">投稿</div>
        <a style=" color: #222;" href=""><div class="item">退出</div></a>
      </div>

      <div class="user">
        <a href=""><div class="item">登录</div></a>
        <a href=""><div class="item">注册</div></a>
      </div>

    </div>
  </div>
  <div class="header-bg">
    <img class="bg-img" width="100%" src="http://oiq23viaf.bkt.clouddn.com/banner.png">
  </div>
</header>
<!--导航-->
<div class="tab">
  <div class="tab-item">
    <span class="fa fa-home fa-2x"></span>
    <a href="index.html">主页</a>
  </div>
  <div class="tab-item">
    <span class="num">55</span>
    <a href="tea.html">茶会</a>
  </div>
  <div class="tab-item">
    <span class="num">5z</span>
    <a href="book.html">本子</a>
  </div>
  <div class="tab-item">
    <span class="num">55</span>
    <a href="video.html">视频</a>
  </div>
  <div class="tab-item">
    <span class="num">55</span>
    <a href="music.html">音乐</a>
  </div>

  <div class="tab-item">
    <span class="num">55</span>
    <a href="rescource.html">资源</a>
  </div>

  <div class="tab-item">
    <span class="num">55</span>
    <a href="">小组</a>
  </div>
</div>

<!--内容-->
<div class="content">
  <div class="xiaohai-container" style="background-color: #efefef;margin-top: 10px;position: relative;padding-bottom: 40px">
    <div id="rule-tea">
      <div class="left"></div>
      <ul>
        <li class="@if($tag == '') active @endif"><a href="?tag=">全部</a></li>
        <li class="@if($tag == '交流') active @endif"><a href="?tag=交流">交流</a></li>
        <li class="@if($tag == '动画资讯') active @endif"><a href="?tag=动画资讯">动画资讯</a></li>
        <li class="@if($tag == '其他资讯') active @endif"><a href="?tag=其他资讯">其他资讯</a></li>
        <li class="@if($tag == '茶会事务') active @endif"><a href="?tag=茶会事务">茶会事务</a></li>

      </ul>

      <div class="all_rule">
        <h2>论坛bug反馈&建议(仮)</h2>
        <p>如图说明：</p>
        <p>第一 本帖回复需与论坛bug，系统错误，建议有关，无关内容会被删帖，请勿在此水帖；</p>
        <p></p>
        <p></p>
      </div>
    </div>


    <div class="tea-tool">
      <div class="left">
        <div class="title">
          <p class="bottom-boder"><a href="#">22</a></p>
          <p>POSTED BY</p>
          <p class="bottom-boder"><a href="#">33</a></p>
          <p>POSTED IN</p>
          <p class="bottom-boder">asdsa</p>
          <p>COMMENTS</p>
          <p class="bottom-boder">55次評價</p>
        </div>
      </div>
      <div class="right">

        <div class="content">
          <h2>11</h2>
          <div style="overflow: hidden">
            <a href="book_detail.html">
              <img  class="tea-thumb"  src="images/1.jpg" alt="" width="100%">
            </a>
          </div>
          <p style="margin-top: 20px;overflow:hidden;text-overflow:ellipsis;height: 80px">{{$item->content}}</p>
        </div>
        <div class="last">
          <span>最新評論</span>
          <ul>

            <li>
              <img  src="images/avatar.png" alt="1" />
              <p style="overflow:hidden;text-overflow:ellipsis; -o-text-overflow:ellipsis;white-space:nowrap;" >sadsa</p>
            </li>

          </ul>
        </div>
      </div>
    </div>

    <div class="tea-tool">
      <div class="left">
        <div class="title">
          <p class="bottom-boder"><a href="#">22</a></p>
          <p>POSTED BY</p>
          <p class="bottom-boder"><a href="#">33</a></p>
          <p>POSTED IN</p>
          <p class="bottom-boder">asdsa</p>
          <p>COMMENTS</p>
          <p class="bottom-boder">55次評價</p>
        </div>
      </div>
      <div class="right">

        <div class="content">
          <h2>11</h2>
          <div style="overflow: hidden">
            <a href="book_detail.html">
              <img  class="tea-thumb"  src="images/2.jpg" alt="" width="100%">
            </a>
          </div>
          <p style="margin-top: 20px;overflow:hidden;text-overflow:ellipsis;height: 80px">{{$item->content}}</p>
        </div>
        <div class="last">
          <span>最新評論</span>
          <ul>

            <li>
              <img  src="images/avatar.png" alt="1" />
              <p style="overflow:hidden;text-overflow:ellipsis; -o-text-overflow:ellipsis;white-space:nowrap;" >sadsa</p>
            </li>

          </ul>
        </div>
      </div>
    </div>

    <div class="tea-tool">
      <div class="left">
        <div class="title">
          <p class="bottom-boder"><a href="#">22</a></p>
          <p>POSTED BY</p>
          <p class="bottom-boder"><a href="#">33</a></p>
          <p>POSTED IN</p>
          <p class="bottom-boder">asdsa</p>
          <p>COMMENTS</p>
          <p class="bottom-boder">55次評價</p>
        </div>
      </div>
      <div class="right">

        <div class="content">
          <h2>11</h2>
          <div style="overflow: hidden">
            <a href="book_detail.html">
              <img  class="tea-thumb"  src="images/3.jpg" alt="" width="100%">
            </a>
          </div>
          <p style="margin-top: 20px;overflow:hidden;text-overflow:ellipsis;height: 80px">{{$item->content}}</p>
        </div>
        <div class="last">
          <span>最新評論</span>
          <ul>

            <li>
              <img  src="images/avatar.png" alt="1" />
              <p style="overflow:hidden;text-overflow:ellipsis; -o-text-overflow:ellipsis;white-space:nowrap;" >sadsa</p>
            </li>

          </ul>
        </div>
      </div>
    </div>

    <div class="tea-tool">
      <div class="left">
        <div class="title">
          <p class="bottom-boder"><a href="#">22</a></p>
          <p>POSTED BY</p>
          <p class="bottom-boder"><a href="#">33</a></p>
          <p>POSTED IN</p>
          <p class="bottom-boder">asdsa</p>
          <p>COMMENTS</p>
          <p class="bottom-boder">55次評價</p>
        </div>
      </div>
      <div class="right">

        <div class="content">
          <h2>11</h2>
          <div style="overflow: hidden">
            <a href="book_detail.html">
              <img  class="tea-thumb"  src="images/4.jpg" alt="" width="100%">
            </a>
          </div>
          <p style="margin-top: 20px;overflow:hidden;text-overflow:ellipsis;height: 80px">{{$item->content}}</p>
        </div>
        <div class="last">
          <span>最新評論</span>
          <ul>

            <li>
              <img  src="images/avatar.png" alt="1" />
              <p style="overflow:hidden;text-overflow:ellipsis; -o-text-overflow:ellipsis;white-space:nowrap;" >sadsa</p>
            </li>

          </ul>
        </div>
      </div>
    </div>

    <div class="tea-tool">
      <div class="left">
        <div class="title">
          <p class="bottom-boder"><a href="#">22</a></p>
          <p>POSTED BY</p>
          <p class="bottom-boder"><a href="#">33</a></p>
          <p>POSTED IN</p>
          <p class="bottom-boder">asdsa</p>
          <p>COMMENTS</p>
          <p class="bottom-boder">55次評價</p>
        </div>
      </div>
      <div class="right">

        <div class="content">
          <h2>11</h2>
          <div style="overflow: hidden">
            <a href="book_detail.html">
              <img  class="tea-thumb"  src="images/5.jpg" alt="" width="100%">
            </a>
          </div>
          <p style="margin-top: 20px;overflow:hidden;text-overflow:ellipsis;height: 80px">{{$item->content}}</p>
        </div>
        <div class="last">
          <span>最新評論</span>
          <ul>

            <li>
              <img  src="images/avatar.png" alt="1" />
              <p style="overflow:hidden;text-overflow:ellipsis; -o-text-overflow:ellipsis;white-space:nowrap;" >sadsa</p>
            </li>

          </ul>
        </div>
      </div>
    </div>

  </div>


</div>
</body>
<script src="node_modules/jquery/dist/jquery.min.js"></script>
</html>